<template>
  <div class='manage-barrage'>
    <p class="title">{{title}} <el-button v-for="(item,index) in btnsData" :key="index" :type="item.type" class="btn-add fr" @click="item.click">{{item.label}}</el-button>
    </p>
    <div class="table-box">
      <Table :modelData="modelData" :listData="listData" :pageInfo="pageInfo"></Table>
    </div>
  </div>
</template>
<script>
import Table from "../../components/table";
export default {
  components: { Table },
  name: "",
  data() {
    return {
      title: "弹幕管理",
      btnsData: [
        // { label: "停止", type: "danger", click: this.end },
        // { label: "开启", type: "success", click: this.start },
        // { label: "满屏", type: "primary", click: this.full }
      ],
      modelData: [
        { myType: "index", label: "序号" },
        { myType: "normal", prop: "despatcherName", label: "发送人" },
        { myType: "normal", prop: "despatchTimeStr", label: "发送时间" },
        { myType: "normal", prop: "content", label: "弹幕信息" },
      ],
      listData: [],
      pageInfo: {
        page: 1,
        total: 10,
        size: 10,
        changePage: this.changePage
      }
    };
  },
  methods: {
    // 满屏
    full(){
      console.log("满屏");
    },
    // 开始
    start() {
      window.reConnect_barrage()
      console.log('重连需要重新生成socket')
    },
    // 停止
    end() {
      socket_barrage.close()
    },

    // 新增
    add() {
      this.$store.state.add.show = true;
    },
    edit(scope) {
      this.add();
    },
    // 删除
    delete(scope) {
      this.$store.state.confirmInfo.message = "是否确认删除？";
      this.$store.state.confirmInfo.show = true;
    },
    // 翻页
    changePage() {},

    getListData(){
      var params={
        currPageNo:this.pageInfo.page
      }
      _g.apiPost('barrageManage/init.do',params).then(res=>{
        this.pageInfo.total=res.data.total
        this.$set(this,'listData',res.data.list)
      })
    }
  },
  created() {
    this.getListData()
  }
};
</script>
<style lang="scss" scoped>
.manage-barrage {
  width: 100%;
  height: 100%;
  padding: 10px;
  box-sizing: border-box;
  overflow: auto;

  .title {
    font-weight: 600;
    font-size: 20px;
    background-color: #fff;
    text-indent: 20px;
    height: 60px;
    line-height: 60px;
    box-sizing: border-box;
    border-bottom: 1px solid #ebeef5;
  }
  .table-box {
    height: calc(100% - 60px);
  }
}
</style>